import React from "react";
import './index.css';
import { Button } from 'antd';
import Blank from "../../Component/Blank";
import TradeServer from "../../Server/Trade/TradeServer";
import UserCheck from "../../utils/UserCheck";
import { Input } from 'antd';
import MD5 from "../../utils/MD5";


export default class extends React.Component{
    constructor(props){
        super();
        this.state={
            ok:props.ok,
            cancel:props.cancel,
            id:props.id,
            errMsg:"",
            price:props.price,
            pass:""
        }
    }

    UNSAFE_componentWillReceiveProps(props){
        this.setState({
            id:props.id
        })
    }
    ok(){
        TradeServer.SendSellPlaceSell(this.state.id,UserCheck.GetUserID(),this.state.pass)
        .then(response=>{
            console.log(response)
            this.state.ok();
            
        },reject=>{
            this.setState({
                errMsg:reject.msg
            })
        });
    }

    cancel(){
        this.state.cancel();
    }
    render(){
        return(
            <div >
                <div className="QualityPayModel_Info_Title middle">确认支付￥{this.state.price}保证金并接单？ <Blank/></div>
                <div className="QualityPayModel_Info_Title middle">
                    <Input.Password id="ConfirmPass" placeholder="请输入支付密码" 
                    onChange={e=>this.setState({pass: MD5.hex_md5(e.target.value).toUpperCase() })}/>
                </div>
                <div className="errMsg QualityPayModel_Info_Title middle">{this.state.errMsg}</div>
                <div style={{textAlign:"center", marginTop:"1rem"}}>
                    <Button  style={{width:"12rem"}} shape="round"  size="large" onClick={e=>this.cancel()}>
                    取消
                    </Button>
                    <Button  style={{width:"12rem", marginLeft:"0.5rem"}} type="primary" shape="round"  size="large" 
                     onClick={e=>this.ok()}>
                    确认
                    </Button>
                </div>
            </div>
        )
    }
}